<template>
	<view class="container">
		<view class="content">
			<view class="title">
				<view class="title-1">
					<title>我的</title>
				</view>
			</view>
			<view style="display: flex;width: 95%;justify-content: flex-end;">
				<view style="border-radius: 20rpx;">
					<!-- <img style="max-width: 90rpx;max-height: 90rpx;margin-left: 25rpx;" src="@/static/kk.png" alt="" /> -->
					<uni-file-picker readonly :value="fileLists" :imageStyles="imageStyles" file-mediatype="image">
					</uni-file-picker>
				</view>
				<view style="width: 76%;margin-left: 25rpx;">
					<view style="display: flex;justify-content: space-between;">
						<view class="">
							<title class="title-2">LADDA</title>
							<title style="width: 90%;display: flex;flex-direction: row;justify-content: space-between;">
								<title style="color: #fff;font-size: 30rpx;">
									管理员
								</title>
							</title>
						</view>
						<view class="set" @click="account">
							<title style="">
								账户设置
							</title>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view style="width: 90%;">
			<view style="margin: 5% 0 5% 0;display: flex;justify-content: space-between;">
				<title style="font-weight: bold;color: #242f66;">其它设置</title>
			</view>
			<uv-row customStyle="margin-bottom: 10px">
				<uv-col span="4.2">
					<view class=""> <img style="width: 200rpx;height: 200rpx;" src="@/static/merchant.png" alt=""
							@click="merchantArr" />
					</view>
				</uv-col>
				<uv-col span="4.2">
					<view class=""> <img style="width: 200rpx;height: 200rpx;" src="@/static/endPoint.png" alt=""
							@click="endPointArr" />
					</view>
				</uv-col>
				<uv-col span="4">
					<view class=""> <img style="width: 200rpx;height: 200rpx;" src="@/static/personnel.png" alt=""
							@click="personnelArr" />
					</view>
				</uv-col>
			</uv-row>
		</view>

		<tabBar></tabBar>
	</view>
</template>

<script>
	import {
		querySum,
		orderSett
	} from "../../network/Home.js"
	export default {
		data() {
			return {
				list: {},
				imageStyles: {
					width: 64,
					height: 64,
					border: {
						radius: '25rpx'
					}
				},
				listStyles: {
					// 是否显示边框
					border: true,
					// 是否显示分隔线
					dividline: true,
					// 线条样式
					borderStyle: {
						width: 1,
						color: 'blue',
						style: 'dashed',
						radius: 2
					}
				},
				fileLists: [{
					url: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao-small.jpg',
					extname: 'png',
					name: 'shuijiao.png'
				}]
			}
		},
		onLoad(e) {
			console.log(this.fileLists);
			this.avatar()
		},
		methods: {
			avatar() {
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						console.log(loginRes.authResult); // 打印登录凭证
						// 使用登录凭证获取用户信息
						uni.getUserInfo({
							provider: 'weixin',
							success: function(infoRes) {
								console.log(infoRes.userInfo); // 打印用户信息
								console.log('用户昵称为: ' + infoRes.userInfo.nickName); // 打印用户昵称
								// 在这里，你可以将用户的头像和昵称保存到本地或者发送到后端进行处理
								// infoRes.userInfo.avatarUrl是用户的头像链接
								// infoRes.userInfo.nickName是用户的昵称
							}
						});
					}
				});
			},
			account() {
				wx.navigateTo({
					url: '/pages_subPack/mine/terminal/accountSettings/index'
				})
			},
			merchantArr() {
				wx.navigateTo({
					url: '/pages/merchant/index'
				})
			},
			endPointArr() {
				wx.navigateTo({
					url: '/pages_subPack/mine/terminal/bound/index'
				})
			},
			personnelArr() {
				wx.navigateTo({
					url: '/pages_subPack/mine/terminal/clerk/index'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		height: 100vh;
		background: #FFFFFF;
		display: flex;
		align-items: center;
		/* justify-content: center; */
		flex-direction: column;
	}

	.content {
		width: 100%;
		height: 25%;
		background-image: url('@/static/homePage.png');
		background-size: 100% 100%;
	}

	.merchantList {
		background: #f4f4f4;
		height: 80%;
		width: 100%;
	}

	.merchan {
		display: flex;
		justify-content: center;
	}

	.ArrList {
		display: flex;
		align-items: center;
		/* justify-content: center; */
		flex-direction: column;
	}

	.List {
		background: #fff;
		height: 320rpx;
		width: 85%;
		border-radius: 20rpx;
		margin-top: 5%;
	}

	.merchan-data {
		display: flex;
	}

	.imgData {
		width: 100rpx;
		height: 100rpx;
		border-radius: 20rpx;
		background-image: url('@/static/index.png');
		background-size: 100% 100%;
		margin: 40rpx 50rpx 20rpx 50rpx;
	}

	.image {
		max-width: 100rpx;
		max-height: 100rpx;
	}

	.text {
		display: flex;
		flex-flow: column;
	}

	.merchan-data-1 {
		display: flex;
		justify-content: center;
	}

	/deep/.uv-line {
		width: 90% !important;
	}

	.merchan-data-2 {
		margin-top: 8%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}

	.title-1 {
		color: #fff;
		margin: 50px 0px 40px 15px;
		font-size: 50rpx;
		display: grid;
	}

	.title-2 {
		color: #fff;
		font-size: 40rpx;
		display: grid;
	}

	.title-3 {
		color: #fff;
		margin: 0px 0px 5px 15px;
		font-size: 40rpx;
		display: grid;
	}

	.merchan-data-1 {
		display: flex;
		justify-content: center;
	}

	.demo-layout {
		display: flex;
		justify-content: center;
	}

	.charts-box {
		width: 100%;
		height: 300px;
	}

	/deep/.uv-form-item__body {
		padding: 0 !important;
	}

	.set {
		background: rgba(255, 255, 255, 0.2);
		width: 200rpx;
		height: 70rpx;
		color: #ffff;
		border-radius: 10px;
		line-height: 35px;
		text-align: center;
		margin-top: 3%;
	}
</style>